import { Navigate, Outlet } from 'react-router';
import { lazy, Suspense } from 'react'
import Skeleton from '@/comp/Skeleton'
function isLazyComponent(component) {
  //判断是否被lazy包裹的组件
  return typeof component === 'object' && component !== null && component.$$typeof === Symbol.for('react.lazy');
}
const ProtectedRoute = ({ component: Component, ...rest }) => {
  const isAuthenticated = true /* 假设你有一个方法检查用户是否登录 */;

  if (!isAuthenticated) {
    return '无权限'
    // 如果没有认证，重定向到登录页面
    //return <Navigate to="/my" />;
  }
  if (Component) {
    return (
      <Suspense fallback={<Skeleton></Skeleton>}>
        <Component {...rest} />
      </Suspense>
    )
  }

  // 如果已认证，渲染目标组件
  return <Suspense fallback={<Skeleton></Skeleton>}><Outlet></Outlet></Suspense>;
};
//以前的使用方法<Component {...rest} />
export default ProtectedRoute;
